<template>
  <template v-for="item in menuData">
    <el-sub-menu v-if="item.children&&item.children.length" :key="item.id" :index="item.id">
      <template #title>
        <i :class="item.icon"></i>
        <span>{{item.title}}</span>
      </template>
      <CpMenu :menuData="item.children"></CpMenu>
    </el-sub-menu>
    <el-menu-item v-else :key="item.id" :index="item.id">
      <i :class="item.icon"></i>
      <template #title><span>{{item.title}}</span></template>
    </el-menu-item>
  </template>

</template>
<script lang="ts">
import {defineComponent} from 'vue'
export default defineComponent({
  name: 'CpMenu',
  props: {
    menuData: Array
  },
  setup() {
    
  }
})
</script>
<style lang="less" scoped>

</style>


